<template>
	<div id="app">
		<el-container>
			<el-header>
				<Header></Header>
			</el-header>
			<el-main>
				<div class="container">
					<router-view />
				</div>
			</el-main>
			<el-footer>
				<Footer></Footer>
			</el-footer>
		</el-container>
		
		<!-- 回到顶部 -->
		<el-backtop :bottom="60"></el-backtop>
	</div>
</template>

<script>
	import Header from '@/components/Header.vue'
	import Footer from '@/components/Footer.vue'

	export default {
		components: {
			Header,
			Footer
		},
		data() {
			return {
				activeIndex: '1'
			}
		},
		methods: {
			handleSelect(key, keyPath) {
				console.log(key, keyPath);
			}
		}
	}
</script>

<style>
	#app {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	.el-main {
		overflow: hidden !important;
	}

	.el-header {
		position: fixed;
		width: 100%;
		left: 0;
		top: 0;
		z-index: 1500;
		background-color: #fcfcfc;
		border-bottom: 1px double #DCDFE6;
	}

	.el-main {
		margin-top: 60px;
	}
	
	/**
	 * 对话框透明度
	 */
	.el-dialog__wrapper {
		background: rgba(229,229,229,.85);
	}
	
	.el-dialog__header {
	    background-color: #ececec8a;
	}
	
	.el-dialog__body {
	    padding: 20px 20px !important;
	}
	
	.el-tabs__header {
		margin: 0 !important;
	}
		
</style>
